<script setup>
import {userInfoStore}from "../stores/UserInfoPinaStores.js";

let user= userInfoStore()

</script>

<template>
   <div class="tb_content">
      <table style="width: 100%; height: 60%;">
      <tr class="trb">
         <td class="name">用户ID</td ><td class="content" v-text="user.getUserId"></td> 
      </tr>
      <tr class="trb">
         <td class="name">用户名字</td ><td class="content" v-text="user.getUserName" ></td>
      </tr>

      <tr class="trb">
         <td class="name">用户性别</td ><td class="content" v-text="user.getUserSex"></td>
      </tr>

      <tr class="trb">
         <td class="name">用户学号</td ><td class="content" v-text="user.getUserXh"></td>
      </tr>

      <tr class="trb">
         <td class="name">用户电话号码</td ><td class="content" v-text="user.getUserPhone"></td>
      </tr>
      <tr class="trb">
         <td class="name">用户身份</td ><td class="content" >
            <span v-if="user.getUserStatus==0">普通用户</span>
            <span v-if="user.getUserStatus==1">系统管理员</span>
         </td>
      </tr>
   </table>
   </div>
</template>

<style scoped>
   .name{   
      width: 10%;
   }
   .trb{
      background-color: beige;
      height: 10%;
   }
   .tb_content{
      width: 100%;
      height: 100%;
      background-color: rgb(238, 245, 205);
      /* background-image: url(../public/img/bg02.jpg);
      background-size: 100%; */
   }
   .trb:hover{
      background-color: chartreuse;
   }
   .trb:active{
      background-color:rgb(230, 26, 26);
   }

</style>
